<script type="text/javascript" src="<?php echo ThemePath(); ?>/../texteditor/ckeditor/ckeditor.js"></script>
<script type="text/javascript" src="<?php echo ThemePath(); ?>/../texteditor/ckeditor/adapters/jquery.js"></script>
<script type="text/javascript" src="<?php echo ThemePath(); ?>/js/customeForm.js"></script>
<script type="text/javascript" src="<?php echo ThemePath(); ?>/js/bootstrap-timepicker.min.js"></script>
<script type="text/javascript" src="<?php echo ThemePath(); ?>/js/bootstrap-tooltip.js"></script>
<script type="text/javascript" src="<?php echo ThemePath(); ?>/js/bootstrap-popover.js"></script>

<div class="form">
    <?php
    $form = $this->beginWidget('GxActiveForm', array(
        'id' => 'classes-form',
        'enableAjaxValidation' => false,
        'enableClientValidation' => true,
        'clientOptions' => array(
            'validateOnSubmit' => true,
            'validateOnChange' => true,
        ),
        'htmlOptions' => array('enctype' => 'multipart/form-data'),
            ));
    ?>

    <p class="note">
        <?php echo Yii::t('app', 'Fields with'); ?> <span class="required">*</span> <?php echo Yii::t('app', 'are required'); ?>.
    </p>
    <div class="customeClassvalidate" ><p id="errorMsgtext"></p><p id="errorMsg"></p></div>



    <?php
    if ($model->isNewRecord) {
        $allVenueSelected = '';
        $this->widget('zii.widgets.jui.CJuiTabs', array(
            'tabs' => array(
                'Class Information' => array('id' => 'class-id', 'content' => $this->renderPartial(
                            '/classes/class_info', array('form' => $form, 'model' => $model, 'modelFunLearning' => $modelFunLearning), TRUE)),
                'Class Photo' => array('id' => 'classImage-id', 'content' => $this->renderPartial(
                            '/classImage/_form', array('form' => $form, 'model' => $modelClassImage, 'photos' => $photos), TRUE)),
                'Class Venue Batch' => array('id' => 'venue-id', 'content' => $this->renderPartial(
                            '/classVenue/_form', array('form' => $form, 'model' => $modelClassVenue,
                        'modelClassBatch' => $modelClassBatch,
                        'modelClassEarlyDiscount' => $modelClassEarlyDiscount,
                        'modelGroupDiscount' => $modelGroupDiscount,
                        'modelClassStructures' => $modelClassStructures,
                        'modelClasses' => $model,
                        'modelTicketBooked' => $modelTicketBooked,
                            ), TRUE)),
            ),
            // additional javascript options for the tabs plugin
            'options' => array(
                'collapsible' => true,
            ),
        ));
    } else {
        $this->widget('zii.widgets.jui.CJuiTabs', array(
            'tabs' => array(
                'Class Information' => array('id' => 'class-id', 'content' => $this->renderPartial(
                            '/classes/class_info_update', array('form' => $form, 'model' => $model, 'modelFunLearning' => $modelFunLearning,
                            ), TRUE)),
                'Class Photo' => array('id' => 'classImage-id', 'content' => $this->renderPartial(
                            '/classImage/_form', array('form' => $form, 'model' => $modelClassImage, 'photos' => $photos), TRUE)),
                'Class Venue Batch' => array('id' => 'venue-id', 'content' => $this->renderPartial(
                            '/classVenue/_form_update', array('form' => $form, 'model' => $modelClassVenue,
                        'modelClassBatch' => $modelClassBatch,
                        'modelClassEarlyDiscount' => $modelClassEarlyDiscount,
                        'modelGroupDiscount' => $modelGroupDiscount,
                        'modelClassStructures' => $modelClassStructures,
                        'modelClasses' => $model,
                        'modelTicketBooked' => $modelTicketBooked,
                        'modelclassWithVenue' => $modelclassWithVenue,
                        'allVenues' => $allVenues,
                            ), TRUE)),
            ),
            // additional javascript options for the tabs plugin
            'options' => array(
                'collapsible' => true,
            ),
        ));
        ?>

    <?php } ?>
    <div class="row">

        <div class="rowControl" style="margin-top: 10px;">
            <?php
            echo GxHtml::submitButton(Yii::t('app', 'Save'), array('class' => 'btn btn-primary', 'id' => 'save_class'));
            ?>
        </div>  </div>
    <input type="hidden" id="getAllselectVenueVal" value="<?php echo $allVenueSelected; ?>">

</div>

<?php
$this->endWidget();
?>
<script type="text/javascript">
    $(document).ready(function() {
        $('#class_short_description').ckeditor();
        $('#class_description').ckeditor();
        $('#class_outcome').ckeditor();
        $('#class_prerequisites').ckeditor();
    
<?php
Yii::app()->user->setState('images', NULL);
?>  });


        $('#save_class').click(function(e) {

            var isValid = true;
            $('.requiredfield').each(function() {
                if ($.trim($(this).val()) == '') {
                    isValid = false;
                    $(this).css({"border": "1px solid red", "background": "#FFCECE"});
                    $('#errorMsgtext').html("<p>All Fields with * are required ....</p>");
                    $("#errorMsgtext").focus();
                    window.location = '#errorAnchor';
                } else {
                    $(this).css({"border": "", "background": ""});
                }
            });
            if ($("#class_short_description").val() == '') {
                $('.shortDesc').text('Short Description cannot be blank.');
                $(".shortDesc").focus();
                return false;
            }
            if ($("#class_description").val() == '') {
                $('.shortDesc').text('');
                $('.descritions').text('Class Description cannot be blank.Short.');
                $(".descritions").focus();
                return false;
            }
            if ($("#class_outcome").val() == '') {
                $('.descritions').text('');
                $('.class_outcome').text('Outcome  cannot be blank.');
                $(".class_outcome").focus();
                return false;
            }
            if ($("#class_prerequisites").val() == '') {
                $('.class_outcome').text('');
                $('.class_prerequisites').text('Prerequisites cannot be blank.');
                $(".class_prerequisites").focus();
                return false;
            }
            if ($('#imagevalidation').val() == '') {
                $('#errorMsg').html("<p>Please upload image ....</p>");
                return false;
                $("#errorMsg").focus();
            }
            if ($("#addimagevalidation").val() == '') {
                $('#errorMsg').html("<p>Please upload image ....</p>");
                return false;
                $("#errorMsg").focus();
            }

            if (isValid == false)
                e.preventDefault();
        });</script>
<script>
        function getAllCountry(countryId) {
            $("#classVenuecountryId").val(countryId);
            $.post("<?php echo Yii::app()->createUrl("classes/getAllCountry"); ?>", {countryId: countryId}, function(result) {
                var countryId = $("#classVenuecountryId").val();
                $("." + countryId).html(result);
                getStateDependonCountry(countryId);
            });
        }
        function getStateDependonCountry(id) {
            var stateId = id.split("_");
            $("#classVenuecountryId").val(stateId[3]);
            var countryId = $("#" + id).val();
            $.post("<?php echo Yii::app()->createUrl("classes/dynamicState"); ?>", {countryId: countryId}, function(result) {
                var stateId = $("#classVenuecountryId").val();
                $("#ClassVenue_state_id_" + stateId).html(result);
                getCityDependonCountry("ClassVenue_state_id_" + stateId)
            });
        }
        function getCityDependonCountry(id) {
            var stateId = id.split("_");
            $("#classVenuecountryId").val(stateId[3]);
            var stateId = $("#" + id).val();
            $.post("<?php echo Yii::app()->createUrl("classes/dynamicCity"); ?>", {stateId: stateId}, function(result) {
                var cityId = $("#classVenuecountryId").val();
                $("#ClassVenue_city_id_" + cityId).html(result);
            });
        }

        function getVenueName(venueId) {
            $("#selectVenuename").val(venueId);
            $.post("<?php echo Yii::app()->createUrl("classes/getAllVenue"); ?>", {venueId: venueId}, function(result) {
                var venueId = $("#selectVenuename").val();
                $("." + venueId).html(result);
            });
        }

        function getVanueDeatils(id) {
            var venueId = id.split("_");
            $("#classVenuecountryId").val(venueId[2]);
            var venueId = $("#" + id).val();
            var emptyvenueId = $("#classVenuecountryId").val();
            updateTextArea(id);
            if (venueId == '') {
                removeVanueValue(emptyvenueId)
            }
            else {
                num = 0;
                var selectedValue = $("#getAllselectVenueVal").val();
                var array = selectedValue.split(",");
                for (i = 0; i < array.length; i++)
                    (array[i] == venueId) ? num++ : "";
                if (num == 1)
                {
                    getVenueDetailsById(venueId)
                    $("#Error_MSG_" + id).css("display", "none")
                }
                else {
                    removeVanueValue(emptyvenueId);
                    $("#Error_MSG_" + id).css("display", "block")
                    $("#" + id).val('')
                }


            }
        }
        function updateTextArea() {
            var allVals = [];
            $('.selectVenue').each(function() {
                allVals.push($(this).val());
            });
            $('#getAllselectVenueVal').val(allVals)
        }

        function getPrimaryImage(id) {
            if (confirm("Are you sure for make this primary photo?")) {
                var imagename = id;
                $.post("<?php echo Yii::app()->createUrl("classes/makePrimaryImage"); ?>", {imagename: imagename}, function(result) {
                });
            }
            return false;
        }


        function getAllState(stateId) {
            $("#classVenuestateId").val(stateId);
            $.post("<?php echo Yii::app()->createUrl("classes/getAllState"); ?>", {stateId: stateId}, function(result) {
                var stateId = $("#classVenuestateId").val();
                $("." + stateId).html(result);
            });
        }

        function getAllCity(cityid) {
            $("#classVenuecityId").val(cityid);
            $.post("<?php echo Yii::app()->createUrl("classes/getAllCity"); ?>", {cityid: cityid}, function(result) {
                var cityid = $("#classVenuecityId").val();
                $("." + cityid).html(result);
            });
        }
        $('.multipleImage').click(function() {
            $('#imagevalidation').val('1')
        })
        $('#XUploadForm_file').click(function() {
            $('#addimagevalidation').val('1')
        })
        $('.cancelImage').click(function() {
            $('#addimagevalidation').val('')
            $('#imagevalidation').val('')
        })
        function getVenueDetailsById(venueId) {
            $.post("<?php echo Yii::app()->createUrl("classes/SelectedVenue"); ?>", {venueId: venueId}, function(result) {
                var obj = jQuery.parseJSON(result);
                var venueId = $("#classVenuecountryId").val();
                getAllState("ClassVenue_state_id_" + venueId);
                $("#ClassVenue_name_" + venueId).val('' + obj.name);
                $("#ClassVenue_address_line1_" + venueId).val('' + obj.address_line1);
                $("#ClassVenue_address_line2_" + venueId).val('' + obj.address_line2);
                $("#ClassVenue_venue_locality_" + venueId).val('' + obj.venue_locality);
                $("#ClassVenue_zip_code_" + venueId).val('' + obj.zip_code);
                $("#ClassVenue_country_id_" + venueId).val('' + obj.country_id);
                $("#ClassVenue_state_id_" + venueId).val('' + obj.state_id);
                $("#ClassVenue_city_id_" + venueId).val('' + obj.city_id);
                $("#ClassVenue_name_" + venueId).attr("readonly", "readonly");
                $("#ClassVenue_address_line1_" + venueId).attr("readonly", "readonly");
                $("#ClassVenue_address_line2_" + venueId).attr("readonly", "readonly");
                $("#ClassVenue_zip_code_" + venueId).attr("readonly", "readonly");
            });
        }
        function removeVanueValue(venueId) {
            $("#ClassVenue_name_" + venueId).removeAttr("readonly");
            $("#ClassVenue_address_line1_" + venueId).removeAttr("readonly");
            $("#ClassVenue_address_line2_" + venueId).removeAttr("readonly");
            $("#ClassVenue_venue_locality_" + venueId).removeAttr("readonly");
            $("#ClassVenue_zip_code_" + venueId).removeAttr("readonly");
            $("#ClassVenue_name_" + venueId).val('');
            $("#ClassVenue_address_line1_" + venueId).val('');
            $("#ClassVenue_address_line2_" + venueId).val('');
            $("#ClassVenue_venue_locality_" + venueId).val('');
            $("#ClassVenue_zip_code_" + venueId).val('');
        }

        /////Tolltip code
        function getTolltipId(id) {
            $("#" + id).popover();
        }
        var max = 5;
        function commaSepratedValue(_area, _ticker) {
            var area = document.getElementById(_area);
            var txt = area.value;
            var commas = txt.split(",").length;
            var span = document.getElementById(_ticker);
            if (commas > max) {
                var lastComma = txt.lastIndexOf(",");
                area.value = txt.substring(0, lastComma);
                commas--;
                $('#tagLimit').text('You can type max 5 comma separated tag.');

            }
        }
        $(function() {
            $( "#slider-range-max" ).slider({
                range: "max",
                min: 0,
                max: <?php echo SkillConfig::FUN_LEARING_LIMIT; ?>,
                step: 10,
                value: <?php echo (!$model->isNewRecord) ? $modelFunLearning->fun : 30; ?>,
                slide: function( event, ui ) {
                    $( "#funlearing" ).val( ui.value );
                    $("#learingfun").val(100-ui.value);
                }
            });
            $( "#funlearing" ).val( $( "#slider-range-max" ).slider( "value" ) );
            $( "#learingfun" ).val(100- $( "#slider-range-max" ).slider( "value" ) );
        });

        function getLocality(id){
            var cache = {};
            $( "#"+id ).autocomplete({
                minLength: 2,
                maxLength: 2,
                source: function( request, response ) {
                    var term = request.term;
                    if ( term in cache ) {
                        response( cache[ term ] );
                        return;
                    }
                    $.getJSON( "<?php echo Yii::app()->createUrl("localityName/getLocality"); ?>", request, function( data, status, xhr ) {
                        if(data!=0){
                            cache[ term ] = data;                     
                            response( data );}
                        else{$("#"+id).val('');
                            alert('please type Currect Name');
                            $("#"+id).focus();}
                    });
                }
            });
        }

</script>
<style>
    .ui-autocomplete {
        max-height: 100px;
        overflow-y: auto;
        /* prevent horizontal scrollbar */
        overflow-x: hidden;
    }
    /* IE 6 doesn't support max-height
     * we use height instead, but this forces the menu to always be this tall
    */
    * html .ui-autocomplete {
        height: 100px;
    }
</style>